feat: standardize tables to allow universal filtering, pagination, bulk actions and match the UI#1196
Conversation
There was a problem hiding this comment.
Code Review
This pull request enhances the food deletion workflow by providing a detailed, collapsible list of diary entries where a food item is used, including deep links to view specific entries. It also introduces URL-based date selection and item highlighting in the diary view. Feedback focuses on improving type safety with type guards in MealCard.tsx, using the Link component for better SPA navigation, restoring internationalization and pluralization for usage counts, and cleaning up server-side data mapping where unselected fields were being processed.
0707388 to
c821103
Compare
618f1e1 to
35a492c
Compare
|
/gemini review |
There was a problem hiding this comment.
Code Review
This pull request refactors the exercise and food management interfaces by introducing a generic, mobile-responsive DataTable component and implementing bulk selection and deletion features across the application. The changes include new UI components for bulk actions, updated hooks for selection management, and enhanced backend logic for assessing food deletion impact. Review feedback highlights a regression in exercise list refreshing, a type mismatch in the bulk selection toolbar, and opportunities to improve code maintainability by refactoring duplicated logic and inconsistent confirmation dialogs.


Description
What problem does this PR solve?
I was integrating #1050 and then #705 and realized that splitting them is not the best idea. The problem was that every "table" like exercises, workout presets, plans, foods and meal basically do the same thing, but look different and have different code. this made it hard to work on them since they differ so much.
How did you implement the solution?
I was looking at this guide and copied the UI elements from Shadcn for the table and integrating tanstack table as a base. It allows to write fully custom tables. Now every tables allow to:
And it is easily expanded for other stuff too. Since the nutrients clutter up the mobile view I removed the custom ones from the main screen and added a modal that show all of them. This can be expanded in the future to show all variants for example. I changed the default page size to 5 on mobile so it doesnt take up so much space vertically.
For #705 I added the ability to fetch the food entries when deleting a food and show them in the frontend with a direct link and highlight of the entry.
Linked Issue:
How to Test
PR Type
Checklist
All PRs:
New features only:
Frontend changes (
SparkyFitnessFrontend/orsrc/):pnpm run validateand it passes.en) translation file.Backend changes (
SparkyFitnessServer/):rls_policies.sqlfor any new user-specific tables.UI changes (components, screens, pages):
Screenshots
Selection with Bulk Actions
Desktop View
Mobile View
Deletion
Which leads to this: